<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">


<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="Start your development with a Dashboard for Bootstrap 4.">
    <meta name="author" content="Creative Tim">
    <title>后台管理系统 - [[${taskCategory != null ? '编辑' : '添加'}]]任务分类</title>
    <!-- Favicon -->
    <link rel="icon" href="/assets/img/brand/favicon.png" type="image/png">
    <!-- Fonts -->
    <link rel="stylesheet" href="">
    <!-- Icons -->
    <link rel="stylesheet" href="/assets/vendor/nucleo/css/nucleo.css" type="text/css">
    <link rel="stylesheet" href="/assets/vendor/@fortawesome/fontawesome-free/css/all.min.css" type="text/css">
    <!-- Page plugins -->
    <link rel="stylesheet" href="/assets/vendor/select2/dist/css/select2.min.css">
    <link rel="stylesheet" href="/assets/vendor/quill/dist/quill.core.css">
    <!-- Argon CSS -->
    <link rel="stylesheet" href="/assets/css/argon.css?v=1.1.0" type="text/css">
    <!-- Dropzone CSS -->
    <link rel="stylesheet" href="/plugins/dropzone/min/dropzone.min.css" type="text/css">
    <link rel="stylesheet" href="/plugins/dropzone/min/basic.min.css" />
</head>

<body>
<!-- Sidenav -->
<nav class="sidenav navbar navbar-vertical fixed-left navbar-expand-xs navbar-light bg-white" id="sidenav-main">
    <div class="scrollbar-inner">
        <!-- Brand -->
        <div class="sidenav-header d-flex align-items-center">
            <a class="navbar-brand" href="/admin/index">
                <img src="/assets/img/brand/blue.png" class="navbar-brand-img" alt="...">
            </a>
            <div class="ml-auto">
                <!-- Sidenav toggler -->
                <div class="sidenav-toggler d-none d-xl-block" data-action="sidenav-unpin" data-target="#sidenav-main">
                    <div class="sidenav-toggler-inner">
                        <i class="sidenav-toggler-line"></i>
                        <i class="sidenav-toggler-line"></i>
                        <i class="sidenav-toggler-line"></i>
                    </div>
                </div>
            </div>
        </div>
        <div class="navbar-inner">
            <!-- Collapse -->
            <div class="collapse navbar-collapse" id="sidenav-collapse-main">
                <!-- Nav items -->
                <ul class="navbar-nav">
                    <li class="nav-item">
                        <a class="nav-link" href="/admin/index" role="button" aria-expanded="false" aria-controls="navbar-dashboards">
                            <i class="ni ni-shop text-primary"></i>
                            <span class="nav-link-text">首页</span>
                        </a>
                    </li>
                    <li class="nav-item active">
                        <a class="nav-link" href="#navbar-examples" data-toggle="collapse" role="button" aria-expanded="false" aria-controls="navbar-examples">
                            <i class="ni ni-ungroup text-orange"></i>
                            <span class="nav-link-text">任务分类管理</span>
                        </a>
                        <div class="collapse show" id="navbar-examples">
                            <ul class="nav nav-sm flex-column">
                                <li class="nav-item">
                                    <a href="/admin/task/category" class="nav-link">任务分类列表</a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#navbar-forms" data-toggle="collapse" role="button" aria-expanded="false" aria-controls="navbar-forms">
                            <i class="ni ni-circle-08"></i>
                            <span class="nav-link-text">雇主管理</span>
                        </a>
                        <div class="collapse" id="navbar-forms">
                            <ul class="nav nav-sm flex-column">
                                <li class="nav-item ">
                                    <a href="/admin/employee/" class="nav-link">雇主列表</a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#navbar-forms" data-toggle="collapse" role="button" aria-expanded="false" aria-controls="navbar-forms">
                            <i class="ni ni-single-02"></i>
                            <span class="nav-link-text">雇员管理</span>
                        </a>
                        <div class="collapse" id="navbar-forms">
                            <ul class="nav nav-sm flex-column">
                                <li class="nav-item">
                                    <a href="/admin/employer/" class="nav-link">雇员列表</a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#navbar-forms" data-toggle="collapse" role="button" aria-expanded="false" aria-controls="navbar-forms">
                            <i class="ni ni-credit-card"></i>
                            <span class="nav-link-text">任务管理</span>
                        </a>
                        <div class="collapse" id="navbar-forms">
                            <ul class="nav nav-sm flex-column">
                                <li class="nav-item">
                                    <a href="/admin/task/" class="nav-link">任务列表</a>
                                </li>
                                <li class="nav-item">
                                    <a href="/admin/task/check" class="nav-link">待审核任务列表</a>
                                </li>
                            </ul>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</nav>
<!-- Main content -->
<div class="main-content" id="panel">
    <!-- Topnav -->
    <nav class="navbar navbar-top navbar-expand navbar-dark bg-primary border-bottom">
        <div class="container-fluid">
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <!-- Navbar links -->
                <ul class="navbar-nav align-items-center ml-md-auto">
                </ul>
                <ul class="navbar-nav align-items-center ml-auto ml-md-0">
                    <li class="nav-item dropdown">
                        <a class="nav-link pr-0" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <div class="media align-items-center">
                              <span class="avatar avatar-sm rounded-circle">
                                <img alt="Image placeholder" src="/assets/img/timg.png">
                              </span>
                                <div class="media-body ml-2 d-none d-lg-block">
                                    <span class="mb-0 text-sm  font-weight-bold">[[${session.admin.username}]]</span>
                                </div>
                            </div>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right">
                            <div class="dropdown-header noti-title">
                                <h6 class="text-overflow m-0">Welcome!</h6>
                            </div>
                            <a href="/admin/task/category/" class="dropdown-item">
                                <i class="ni ni-single-02"></i>
                                <span>任务分类列表</span>
                            </a>
                            <a href="/admin/employer/" class="dropdown-item">
                                <i class="ni ni-settings-gear-65"></i>
                                <span>雇主列表</span>
                            </a>
                            <a href="/admin/employee/" class="dropdown-item">
                                <i class="ni ni-calendar-grid-58"></i>
                                <span>雇员列表</span>
                            </a>
                            <a href="/admin/task" class="dropdown-item">
                                <i class="ni ni-support-16"></i>
                                <span>任务列表</span>
                            </a>
                            <div class="dropdown-divider"></div>
                            <a href="/admin/logout" class="dropdown-item">
                                <i class="ni ni-user-run"></i>
                                <span>退出登录</span>
                            </a>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <!-- Header -->
    <!-- Header -->
    <div class="header bg-primary pb-6">
        <div class="container-fluid">
            <div class="header-body">
                <div class="row align-items-center py-4">
                    <div class="col-lg-6 col-7">
                        <h6 class="h2 text-white d-inline-block mb-0">[[${taskCategory != null ? '编辑' : '添加'}]]任务分类</h6>
                        <nav aria-label="breadcrumb" class="d-none d-md-inline-block ml-md-4">
                            <ol class="breadcrumb breadcrumb-links breadcrumb-dark">
                                <li class="breadcrumb-item"><a href="#"><i class="fas fa-home"></i></a></li>
                                <li class="breadcrumb-item"><a href="#">任务分类管理</a></li>
                                <li class="breadcrumb-item active" aria-current="page">[[${taskCategory != null ? '编辑' : '添加'}]]任务分类</li>
                            </ol>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Page content -->
    <div class="container-fluid mt--6">
        <div class="row">
            <div class="col-lg-12">
                <div class="card-wrapper">
                    <!-- Input groups -->
                    <div class="card">
                        <!-- Card header -->
                        <div class="card-header">
                            <h3 class="mb-0">[[${taskCategory != null ? '编辑' : '添加'}]]任务分类</h3>
                        </div>
                        <!-- Card body -->
                        <div class="card-body">
                            <form method="post" action="/admin/task/category/save" class="needs-validation" novalidate>
                                <input name="id" th:hidden="true" th:value="${taskCategory != null ? taskCategory.id : null}"/>
                                <!-- Input groups with icon -->
                                <div class="form-row">
                                    <div class="col-md-12 mb-3">
                                        <label class="form-control-label" for="validationCustom01" name="categoryName">任务分类名称</label>
                                        <input name="categoryName" type="text" class="form-control" id="validationCustom01" placeholder="请输入任务分类名称"  th:value="${taskCategory != null ? taskCategory.categoryName : ''}"  required>
                                        <div class="invalid-feedback">
                                            任务分类名称不能为空
                                        </div>
                                    </div>
                                </div>
                                <div class="form-row">
                                    <input id="categoryImg" th:hidden="true" name="categoryImg" th:value="${taskCategory != null ? taskCategory.categoryImg : null}"/>
                                    <div class="col-md-12 mb-3">
                                        <label class="form-control-label" for="validationCustom01" name="categoryName">任务分类图片（不修改则不上传）</label>
                                        <div id="dropz" class="dropzone"></div>
                                    </div>
                                </div>
                                <button class="btn btn-primary" type="submit">保存</button>
                                <button class="btn btn-primary" type="button" onclick="javascript :history.back(-1);">返回</button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Footer -->
        <footer class="footer pt-0">
            <div class="row align-items-center justify-content-lg-between">
                <div class="col-lg-6">
                    <div class="copyright text-center text-lg-left text-muted">
                        &copy; 2019 <a href="https://www.creative-tim.com" class="font-weight-bold ml-1" target="_blank">yuu</a>
                    </div>
                </div>
            </div>
        </footer>
    </div>
</div>
<!-- Core -->
<script src="/assets/vendor/jquery/dist/jquery.min.js"></script>
<script src="/assets/vendor/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="/assets/vendor/js-cookie/js.cookie.js"></script>
<script src="/assets/vendor/jquery.scrollbar/jquery.scrollbar.min.js"></script>
<script src="/assets/vendor/jquery-scroll-lock/dist/jquery-scrollLock.min.js"></script>
<!-- Optional JS -->
<script src="/assets/vendor/select2/dist/js/select2.min.js"></script>
<script src="/assets/vendor/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
<script src="/assets/vendor/nouislider/distribute/nouislider.min.js"></script>
<script src="/assets/vendor/quill/dist/quill.min.js"></script>
<script src="/assets/vendor/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js"></script>
<!-- Argon JS -->
<script src="/assets/js/argon.js?v=1.1.0"></script>
<!-- Demo JS - remove this in your project -->
<script src="/assets/js/demo.min.js"></script>
<!-- Dropzone JS -->
<script src="/plugins/dropzone/min/dropzone.min.js"></script>
</body>

<script>
    // Example starter JavaScript for disabling form submissions if there are invalid fields
    (function() {
        'use strict';
        window.addEventListener('load', function() {
            // Fetch all the forms we want to apply custom Bootstrap validation styles to
            var forms = document.getElementsByClassName('needs-validation');
            // Loop over them and prevent submission
            var validation = Array.prototype.filter.call(forms, function(form) {
                form.addEventListener('submit', function(event) {
                    if (form.checkValidity() === false) {
                        event.preventDefault();
                        event.stopPropagation();
                    }
                    form.classList.add('was-validated');
                }, false);
            });
        }, false);
    })();

</script>

<script type="text/javascript">
    var myDropzone = new Dropzone("#dropz", {
        url: "/upload", // 文件提交地址
        method: "post",  // 也可用put
        paramName: "dropzFile", // 默认为file
        maxFiles: 1,// 一次性上传的文件数量上限
        maxFilesize: 10, // 文件大小，单位：MB
        acceptedFiles: ".jpg,.gif,.png,.jpeg", // 上传的类型
        addRemoveLinks: true,
        parallelUploads: 1,// 一次上传的文件数量
        //previewsContainer:"#preview", // 上传图片的预览窗口
        dictDefaultMessage: '请上传任务分类图片',
        dictMaxFilesExceeded: "您最多只能上传1个文件！",
        dictResponseError: '文件上传失败!',
        dictInvalidFileType: "文件类型只能是*.jpg,*.gif,*.png,*.jpeg。",
        dictFallbackMessage: "浏览器不受支持",
        dictFileTooBig: "文件过大上传文件最大支持.",
        dictRemoveLinks: "删除",
        dictCancelUpload: "取消",
        init: function () {
            this.on("success", function (file, data) {
                // 上传成功触发的事件
                $("#categoryImg").val(data.filePath)
            });
            this.on("removedfile", function (file) {
                // 删除文件时触发的方法
                $("#categoryImg").val()
            });
        }
    });
</script>
</html>
